<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>话题</title>
    <link rel="shortcut icon" href="images/ico.png" >
    <script src="js/Navigation.js"></script>
    <style>
    *{margin:0;
    
    }
    body{
        background-color: rgb(231,234,243);
    }
    ul{
        list-style: none;
    }

    /* 话题 */
        #heard{
            margin-top: 2px;
            width: 1180px;
            position: relative;
            left: 0;
            right:0;
            margin: 0 auto;
            margin-top:55px;
            
            padding:10px;
            padding-top: 20px;
            background-color: white;
        }
        #heardUl{
            list-style: none;
            margin-top: 10px;
            margin-left: -40px;
        }
        #heardUl li{
            margin-right: 15px;
            float: left;
        }
        #heardUl img{
            width: 40px;
            height: 40px;
            border-radius: 5px;
        }
        #heardUl p{
            height: 40px;
            line-height:40px;
            font-size: 20px;
            font-weight: 800;
            font-family: '微软雅黑';
            color: rgb(89,81,73);
        }
        #heardP{
            clear: both;
            padding-right:350px;
            line-height: 24px;
            letter-spacing:1px;
            font-size:17px;
            color: rgb(89,81,73);
        }
        #heard button{
            border:none;
            background-color: white;
            color:rgb(109, 104, 100) ;
        }
        #heardUl2{
            list-style: none;
            margin-top: 10px;
            margin-left: -40px;
            font-size: 16px;
           
        }
        #heardUl2 li{
            float: left;
            line-height: 30px;
            text-align: center;
            margin-right:20px ;
            color:rgb(89,81,73)
        }
        #heardUl2 li{
            cursor: pointer;
            color: rgb(145, 156, 177);
        }
        #heardUl2 li:hover{
            color: rgb(118,131,155);
        }
        #heardUl2 li:nth-child(1){
            width: 100px;
            height:30px;
            border:1px solid rgb(0,132,255) ;
            border-radius: 5px;
            color: rgb(0,132,255);
        }
        #heardUl2 li:nth-child(1):hover{
            background-color:rgb(240,248,255) ;
        }
        
        #heardUl2follow{
            background-color: gray;
            border:1px solid gray ;
            border-radius: 5px;
            color: white;
        }
        #heardUl2 li:nth-child(2){
            width: 100px;
            height:30px;
            border:1px solid rgb(0,132,255) ;
            border-radius: 5px;
            color: rgb(0,132,255);
        }
        #heardUl2 li:nth-child(2):hover{
            background-color:rgb(240,248,255) ;
        }
        #clear{
            clear: both;
        }
        #heardUl2 svg{
            width: 20px;
            height:30px;
            float: left;
            margin-left: 10px;
        }


        #nav{
            width: 1200px;
            position: relative;
            left: 0;
            right:0;
            margin: 0 auto;
            margin-top: 10px;
            margin-bottom: 20px;
            background-color: white;
        }
        #left{
            width:740px;
            padding-right: 60px;
            float: left;
            
        }
        .write{
            width: 800px; 
            height: 300px;
            background-color: white; 
            margin-bottom: 10px;
            box-shadow: 0px 0px 3px rgb(204, 217, 235);
            display:none;
            padding-bottom: 20px;
        }
        
        .write ul{
            margin-left: 20px;
            padding-top: 20px;
            list-style: none;
            padding-bottom: 20px;
        }
        .write li{
            float: left;
            color: rgb(102, 102, 102);
        }
        .write li:nth-child(2){
            float: left;
            color: black;
            font-weight: 600;
        }
        #nav .writename  li svg{
            margin:0;
            padding-top:2px;
        }
        #textareas {
            font-size: 18px;
            border: none;
            margin-left: 20px;
        }
        .buttons li{
            cursor:pointer;
        }
        .hui{
            width:740px;
            box-shadow:0px 0px 3px #ddd;
            padding-bottom: 30px; 
            padding-right: 60px;
            float: left;
            margin-bottom: 20px;
        }
        #up{
            width: 60px;
            height: 35px;
            border-style: none;
            background-color: rgb(94,113,179);
            color: white;
            border-radius: 5px;
            margin-left: 700px;
            margin-top: 10px; 
            margin-bottom: 10px;
        }
        #right{
            margin-left: 10px;
            margin-top: 40px;
            width:360px;
            box-shadow:0px 0px 3px #ddd;
            float: left;
            padding-right: 30px;
            padding-bottom: 20px;
        }
        #left hr{
            width: 750px;
            margin-left: 20px;
            background-color: rgb(224, 220, 220);
            height: 1px;
            border:none;
        }
        #right hr{
            width: 390px;
            background-color: rgb(224, 220, 220);
            height: 1px;
            border:none;
        }
        #nav li img{
            width: 45px;
            height: 45px;
            margin-left: -40px;
            float: left;
            margin-right: 10px;
        }
        .ques{
            margin-top: 20px;
            margin-left: 20px;
            padding-bottom: 10px;
        }
        .agree{
            color: rgb(166,152,181);
        }
        .ques p{
            margin-bottom: 10px;
        }
        .ques ul{
            position: relative;
        }
        #nav svg{
            width: 20px;
            height: 20px;
            margin-top: 12px;
            margin-left: 20px;
        }
        .bottom li{
            float: left;
            margin-right: 10px;
            color: rgb(145, 156, 177);
            cursor: pointer;
        }
        .bottom li:hover{
            
            color: rgb(118,131,155);
        }
        .bottom li i{
            width: 0;height: 0;
            border:10px solid rgb(0,132,255);
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-top-width: 0px;
            position: relative;
            top: -17px;
            left: -7px;
            
        }
        .bottom li:nth-child(2) i{
            width: 0;height: 0;
            border:10px solid rgb(0,132,255);
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-bottom-width: 0px;
            position:relative;
            left: 12px;
            top:25px;
            
        }

        .bottom li:first-child{
            width: 150px;
            height: 40px;
            line-height: 40px;
            border-radius: 5px;
            text-align: center;
            font-size: 20px;
            color: rgb(0,132,255);
            background-color: rgb(229,242,255);
            margin-left: -40px;
        }
        .bottom li:first-child:hover{
            background-color: rgb(217,237,255);
            
        }
        .bottom li:nth-child(2){
            width: 40px;
            height: 40px;
            border-radius: 5px;           
            background-color: rgb(229,242,255);
            
        }
        .bottom li:nth-child(2):hover{
            background-color: rgb(217,237,255);
            
        }
        #right ul{
            margin-left: -20px;
        }
        #right li{
            margin-top: 10px;
            color: rgb(23,81,153);
        }
        
        #share{
            position:absolute;
            width: 130px;
            height:260px;
            z-index: 1;
            margin-left:330px;
            margin-top:36px;
            display: none;
        }
        .shareicon{
            width: 0;height: 0;
            border: 11px solid white;
            border-top-width: 0px;
            border-left:9px solid transparent ;
            border-right:9px solid transparent; 
            position:absolute;
            left:50%;
            margin-top:-9px;
            margin-left:-10px;
        }
        .sharemain{
            widows: 100px;
            height: 220px;
            padding:10px 10px;
            background-color: white;
            border-radius: 5px;
            box-shadow: 0px 0px 25px rgb(233, 229, 229);
            font-size:14px;
            color: rgb(133,144,166);
            
        }
        .sharemain a{
            color : rgb(133,144,166);
            text-decoration-line: none;
        }
        .sharemain svg{
            padding-top: 5px;
        }
        .sharemain span{
            padding-left: 5px;
            
        }
        .sharemain img{
            width:110px;
            height: 110px;
            margin-top: 10px;
        }
        #return{
            width: 50px;
            height: 50px;
            background-color: rgb(255, 255, 255);
            position:fixed;
            display: none;
            bottom:5%;
            right: 2%;
            border-radius: 10px;
            box-shadow: 0,0,7px,rgb(204, 217, 235);
        }
        #return:hover{
            background-color: rgb(211,211,211);
            
        }
    </style>
    <script src="https://cdn.bootcdn.net/ajax/libs/Mock.js/1.0.1-beta3/mock-min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        var Random=Mock.Random
        console.log(Mock.mock('@cparagraph(1, 3)'))
        Random.extend({
            constellation:function(date){
                var constellations=['icon01.jpg','icon02.jpg','icon03.jpg','icon04.jpg','icon05.jpg','icon06.jpg','icon07.jpg','icon08.jpg','icon09.jpg','icon10.jpg']
                return this.pick(constellations)
            }
        })
        console.log(Random.constellation())
        $(function(){
            Mock.mock('http://localhost:5500/api/getAllUsers',function(){
                var result=[]
                var Newslength=parseInt(Math.random()*10)+3;
                
                for(var i=0;i<Newslength;i++){
                    var rndUser = Mock.mock({
                        'Comname':Random.cname(),
                        'text':Random.cparagraph(),
                        'logo':Random.constellation(),
                        'num|1-10000':1000,
                        'commentnum|1-500':100,
                    })
                    result.push(rndUser)
                }
                return result
            })
        // $('.second:nth-child(0)').on({
        //     click:function(){
        //         location.href = 'personal.html'
        //     }
        // })
        $('#return').click(function(){
            $('html,body').animate({scrollTop:0},'slow');
        })
        $('#follow').on({
            click:function(){
                if(followflag==true){
                    $('#follow').text('已关注')
                    $('#follow').css('backgroundColor','rgb(0,132,255)')
                    $('#follow').css('color','white')
                    followflag=false
                }
                else{
                    $('#follow').text('关注问题')
                    $('#follow').css('backgroundColor','white')
                    $('#follow').css('color','rgb(0,132,255)')
                    followflag=true
                } 
            },
            mouseover:function(){
                if(followflag== true){
                    $('#follow').css('backgroundColor','rgb(240,248,255)')
                }
            },
            mouseout:function(){
                if(followflag==true){
                    $('#follow').css('backgroundColor','white')
                }
            }

        })
        // var iss=document.querySelectorAll('.wu')
        // var iss = document.getElementsByClassName('wu')
        $('#comment').on('click','.wu',function(){
            var t=$(this).text()
            var myreg = /\d+/ig;
            
             
            if(wuflag==true&&youflag==true){
                var num=parseInt(myreg.exec(t)[0]) 
                num=num+1
                $(this).html(`<i></i>赞同${num}`)
                $(this.firstChild).css('borderColor','white')
                $(this.firstChild).css('borderLeft','8px solid transparent')
                $(this.firstChild).css('borderRight','8px solid transparent')
                $(this.firstChild).css('borderTopWidth','0px')
                $(this).css('backgroundColor','rgb(0,132,255)')
                $(this).css('color','white')
                wuflag=false  
            }

            else if(youflag==true){
                var num=parseInt(myreg.exec(t)[0]) 
                num=num-1
                $(this).html(`<i></i>赞同${num}`)
                $(this.firstChild).css('borderColor','rgb(0,132,255)')
                $(this.firstChild).css('borderLeft','8px solid transparent')
                $(this.firstChild).css('borderRight','8px solid transparent')
                $(this.firstChild).css('borderTopWidth','0px')
                $(this).css('backgroundColor','rgb(229,242,255)')
                $(this).css('color','rgb(0,132,255)')
                wuflag=true
            }
        
        })
        $('#comment').on('mouseover','.wu',function(){
            if(wuflag==true){
                $(this).css('backgroundColor','rgb(217,237,255)')
            }  
        })
        $('#comment').on('mouseout','.wu',function(){
            if(wuflag==true){
                $(this).css('backgroundColor','rgb(229,242,255)')
            }  
        })
        
        $('#comment').on('click','.you',function(){
            if(youflag==true&&wuflag==true){
                console.log(this.firstChild)
                $(this.firstChild).css('borderColor','white')
                $(this.firstChild).css('borderLeft','8px solid transparent')
                $(this.firstChild).css('borderRight','8px solid transparent')
                $(this.firstChild).css('borderBottomWidth','0px')
                $(this).css('backgroundColor','rgb(0,132,255)')
                youflag=false
            }
            else if(wuflag==true){
                $(this.firstChild).css('borderColor','rgb(0,132,255)')
                $(this.firstChild).css('borderLeft','8px solid transparent')
                $(this.firstChild).css('borderRight','8px solid transparent')
                $(this.firstChild).css('borderBottomWidth','0px')
                $(this).css('backgroundColor','rgb(229,242,255)')
                $(this).css('color','rgb(0,132,255)')
                youflag=true
            }   
        })
        $('#comment').on('mouseover','.you',function(){
            if(youflag==true){
                $(this).css('backgroundColor','rgb(217,237,255)')
            }  
        })
        $('#comment').on('mouseout','.you',function(){
            if(youflag==true){
                $(this).css('backgroundColor','rgb(229,242,255)')
            }  
        })


        $('#shares').on('click',function(){
            if(sharesflag==true){
                $('#share').css('display','inline-block')
                sharesflag=false
            }
            else{
                $('#share').css('display','none')
                sharesflag=true
            }
           
        })
        //调用数据
        if(sessionStorage['titleProfile']){
            var titleProfile = JSON.parse(sessionStorage['titleProfile'])
            var headContent = document.querySelector('#heardP')
            var headTitle = document.querySelector('#heard')
            var aIds = document.querySelector('#aIds')
            console.log(headContent.firstElementChild)
            headTitle.firstElementChild.nextElementSibling.innerHTML = titleProfile[0].titleName
            headContent.firstElementChild.innerHTML  = titleProfile[0].titleContent.substring(0, 80)+'......'
            console.log(aIds.innerHTML)
            aIds.innerHTML=titleProfile[0].aId
        }
        //读取限制字数
        $('.alltext').on('click',function(){
            if(alltextflag==true){
                headContent.firstElementChild.innerHTML  = titleProfile[0].titleContent
                $('.alltext')[0].firstChild==
                console.log($('.alltext')[0].firstChild)
                alltextflag=false
            }
            else{
                headContent.firstElementChild.innerHTML  = titleProfile[0].titleContent.substring(0, 80)+'......'
                alltextflag=true
            }
            
        })
        console.log(document.querySelector('#aIds'.innerHTML))
        $.ajax({
            url:'http://localhost:3000/userComment/topic',
            type:'get',
            data:{
                aId:document.querySelector('#aIds').innerHTML
            },
            dataType:'json',
            success(res){
                $('#commentNum').html(res.data.length)
                $('#commentNum1').html(res.data.length)
                var data = res.data
                var strHTML = ''
                console.log(res)
                for(var i=0;i<res.data.length;i++){
                    strHTML+=`
                    <div class="ques">
                                    <ul>
                                        <li>
                                            <img src="http://localhost:3000/upload/${data[i].headImg}" alt="">
                                        </li>
                                        <li>
                                            <p>${data[i].nickName}</p>
                                        </li>
                                        <li>
                                            <p>${data[i].occupation} </p>
                                        </li>
                                    </ul>
                                    <p class="agree">${data[i].response}人赞同该回答</p>
                                    <p>${data[i].content}</p>
                                    <p class="agree">发布与${data[i].pTime}小时前</p>
                                    <ul class="bottom">
                                        <li class='wu'><i></i> 赞同${data[i].likeClick}</li>
                                        <li class='you'><i></i></li>
                                        <li>
                                            <svg t="1597728984114" class="icon" viewBox="0 0 1024 1024" vesrsion="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6206" width="200" height="200"><path d="M512 0C229.180952 0 0 229.180952 0 512c0 141.409524 58.514286 270.628571 151.161905 363.27619C197.485714 921.6 0 1024 0 1024h512c282.819048 0 512-229.180952 512-512S794.819048 0 512 0z m-195.047619 365.714286h268.190476c19.504762 0 36.571429 17.066667 36.571429 36.571428S604.647619 438.857143 585.142857 438.857143H316.952381c-19.504762 0-36.571429-17.066667-36.571429-36.571429S297.447619 365.714286 316.952381 365.714286z m414.47619 292.571428H316.952381c-19.504762 0-36.571429-17.066667-36.571429-36.571428S297.447619 585.142857 316.952381 585.142857h414.47619c19.504762 0 36.571429 17.066667 36.571429 36.571429S750.933333 658.285714 731.428571 658.285714z" fill="#8a8a8a" p-id="6207"></path></svg>
                                            ${data[i].response}条评论
                                        </li>
                                        <li>
                                            <svg t="1597727048665" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4554" width="200" height="200"><path d="M711.9 959.9c-10.8 0-21.5-3.3-30.7-9.7L495.3 820.9c-1.5-1-3.5-0.9-4.8 0.4l-72 68.4c-16.2 15.4-39.7 19.2-59.8 9.7-20.2-9.4-32.3-29.9-30.9-52.2l9-141.8c0.8-12.1 5.7-23.8 13.9-32.8l216-237.8c9.3-10.2 25.1-11 35.3-1.7 10.2 9.3 11 25.1 1.7 35.3l-216 237.8c-0.6 0.6-0.9 1.5-1 2.3l-9 141.8c0 0.8-0.2 2.6 2.2 3.7 2.4 1.1 3.7-0.2 4.2-0.7l72-68.4c18.4-17.5 46.9-19.7 67.8-5.2l185.9 129.4c1.1 0.8 2.4 0.9 3.6 0.4 1.3-0.5 2.1-1.5 2.3-2.8L858.2 140c0.1-0.6 0.4-2.3-1.5-3.7-1.9-1.4-3.4-0.7-4-0.4l-745.9 372c-0.5 0.2-2 1-2.1 3.2-0.1 2.2 1.3 3.1 1.8 3.4l198 123.2c11.7 7.3 15.3 22.7 8 34.4s-22.7 15.3-34.4 8L80 557c-16.5-10.3-26.2-28.8-25.3-48.2 0.9-19.5 12.3-36.9 29.7-45.6l745.9-372c18.4-9.2 40-7.2 56.4 5.2s24.3 32.6 20.5 52.8L764.9 915.9c-3.4 18-15.5 33-32.5 40-6.6 2.7-13.6 4-20.5 4z" p-id="4555" fill="#8a8a8a"></path></svg>
                                            分享
                                        </li>
                                        <li>
                                            <svg t="1597738890778" class="icon" viewBox="0 0 1025 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9230" width="200" height="200"><path d="M1024 384a103.04 103.04 0 0 0-72.32-64l-215.68-58.24L590.72 49.92A101.12 101.12 0 0 0 512 0a92.8 92.8 0 0 0-78.72 51.84l-120.32 192-161.28 49.28L72.96 320a97.28 97.28 0 0 0-68.48 56.96 115.2 115.2 0 0 0 19.84 97.28l140.8 178.56-7.68 256a117.76 117.76 0 0 0 17.92 88.96 64 64 0 0 0 49.92 21.12 181.76 181.76 0 0 0 60.8-13.44l208-84.48 236.16 87.68a141.44 141.44 0 0 0 42.88 7.68c29.44 0 78.72-13.44 82.56-103.68l-12.8-230.4 152.96-205.44A106.88 106.88 0 0 0 1024 384" p-id="9231" fill="#8a8a8a"></path></svg>
                                            收藏
                                        </li>
                                        <li>
                                            <svg t="1597738927006" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10066" width="200" height="200"><path d="M704.004477 124.640742c-74.442456 0-148.627039 33.120328-196.407252 87.968517-47.745421-54.848189-113.125477-87.968517-187.593516-87.968517-139.306766 0-252.630764 111.132076-252.630764 247.720941 0 222.305085 206.957539 361.722368 343.891258 453.981608 34.504862 23.232121 56.45478 37.229926 78.723969 55.406914l17.609053 17.609053 17.609053-17.609053c22.251793-18.176988 53.032844-32.17377 87.528496-55.42431 136.951115-92.240821 343.891258-231.6755 343.891258-453.963189C956.626032 235.772818 843.293847 124.640742 704.004477 124.640742z" p-id="10067" fill="#8a8a8a"></path></svg>
                                            喜欢
                                        </li>
                                    </ul>
                                    <p style="clear: both;"></p>
                                </div>
                                <hr>`
                }
                $('#comment').html(strHTML)
            }
            
        })
        $.ajax({
            url:'http://localhost:3000/userComment/getAuthor',
            type:'get',
            data:{
                aId:document.querySelector('#aIds').innerHTML
            },
            dataType:'json',
            success:function(res){
                console.log($('#authorImg').children()[0].src=`http://localhost:3000/upload/${res.data[0].headImg}`)
                $('#authorImg').children().src = res.data[0].headImg
                $('#authorImg').next().html(res.data[0].nickName)
            }
        })
       

    })

    //load结尾
    var alltextflag=true
    var sharesflag=true
    var followflag=true
    var writeflag=true
    var wuflag=true
    var youflag=true
    function writes(obj){
        if(writeflag==true){
            document.getElementsByClassName('write')[0].style.display='inline-block'
            writeflag=false
        }
        else{
            writeflag=true
            document.getElementsByClassName('write')[0].style.display='none'
        }
    }

    function add(){
    
        var txt=$('#textareas')[0].value
        // $('#textareas')[0].value=''
        console.log(txt)
        adds(txt)
        $.ajax({
            url:'http://localhost:3000/mainContent/addCommentss',
            type:'get',
            data:{
                uId:localStorage['name'],
                aId:document.querySelector('#aIds').innerHTML,
                content:document.querySelector('#textareas').value
            },
            dataType:'json',
            success:function(res){
                console.log("添加评论成功")
            }
        })
       
      
    }
    function adds(txt){

        var strHTMl=''
            strHTMl+=`  <div class="ques">
                    <ul>
                        <li>
                            <img src="images/logo.jpg" alt="">
                        </li>
                        <li>
                            <p>知遇001</p>
                        </li>
                        <li>
                            <p>我自己</p>
                        </li>
                    </ul>
                        <p class="agree">0人赞同该回答</p>
                        <p>${txt}</p>
                        <p class="agree">刚刚</p>
                    <ul class="bottom">
                        <li><i></i> 赞同0</li>
                        <li><i></i></li>
                        <li>
                            <svg t="1597728984114" class="icon" viewBox="0 0 1024 1024" vesrsion="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6206" width="200" height="200"><path d="M512 0C229.180952 0 0 229.180952 0 512c0 141.409524 58.514286 270.628571 151.161905 363.27619C197.485714 921.6 0 1024 0 1024h512c282.819048 0 512-229.180952 512-512S794.819048 0 512 0z m-195.047619 365.714286h268.190476c19.504762 0 36.571429 17.066667 36.571429 36.571428S604.647619 438.857143 585.142857 438.857143H316.952381c-19.504762 0-36.571429-17.066667-36.571429-36.571429S297.447619 365.714286 316.952381 365.714286z m414.47619 292.571428H316.952381c-19.504762 0-36.571429-17.066667-36.571429-36.571428S297.447619 585.142857 316.952381 585.142857h414.47619c19.504762 0 36.571429 17.066667 36.571429 36.571429S750.933333 658.285714 731.428571 658.285714z" fill="#8a8a8a" p-id="6207"></path></svg>
                            0条评论
                        </li>
                        <li>
                            <svg t="1597727048665" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4554" width="200" height="200"><path d="M711.9 959.9c-10.8 0-21.5-3.3-30.7-9.7L495.3 820.9c-1.5-1-3.5-0.9-4.8 0.4l-72 68.4c-16.2 15.4-39.7 19.2-59.8 9.7-20.2-9.4-32.3-29.9-30.9-52.2l9-141.8c0.8-12.1 5.7-23.8 13.9-32.8l216-237.8c9.3-10.2 25.1-11 35.3-1.7 10.2 9.3 11 25.1 1.7 35.3l-216 237.8c-0.6 0.6-0.9 1.5-1 2.3l-9 141.8c0 0.8-0.2 2.6 2.2 3.7 2.4 1.1 3.7-0.2 4.2-0.7l72-68.4c18.4-17.5 46.9-19.7 67.8-5.2l185.9 129.4c1.1 0.8 2.4 0.9 3.6 0.4 1.3-0.5 2.1-1.5 2.3-2.8L858.2 140c0.1-0.6 0.4-2.3-1.5-3.7-1.9-1.4-3.4-0.7-4-0.4l-745.9 372c-0.5 0.2-2 1-2.1 3.2-0.1 2.2 1.3 3.1 1.8 3.4l198 123.2c11.7 7.3 15.3 22.7 8 34.4s-22.7 15.3-34.4 8L80 557c-16.5-10.3-26.2-28.8-25.3-48.2 0.9-19.5 12.3-36.9 29.7-45.6l745.9-372c18.4-9.2 40-7.2 56.4 5.2s24.3 32.6 20.5 52.8L764.9 915.9c-3.4 18-15.5 33-32.5 40-6.6 2.7-13.6 4-20.5 4z" p-id="4555" fill="#8a8a8a"></path></svg>
                            分享
                        </li>
                        <li>
                            <svg t="1597738890778" class="icon" viewBox="0 0 1025 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9230" width="200" height="200"><path d="M1024 384a103.04 103.04 0 0 0-72.32-64l-215.68-58.24L590.72 49.92A101.12 101.12 0 0 0 512 0a92.8 92.8 0 0 0-78.72 51.84l-120.32 192-161.28 49.28L72.96 320a97.28 97.28 0 0 0-68.48 56.96 115.2 115.2 0 0 0 19.84 97.28l140.8 178.56-7.68 256a117.76 117.76 0 0 0 17.92 88.96 64 64 0 0 0 49.92 21.12 181.76 181.76 0 0 0 60.8-13.44l208-84.48 236.16 87.68a141.44 141.44 0 0 0 42.88 7.68c29.44 0 78.72-13.44 82.56-103.68l-12.8-230.4 152.96-205.44A106.88 106.88 0 0 0 1024 384" p-id="9231" fill="#8a8a8a"></path></svg>
                            收藏
                        </li>
                        <li>
                            <svg t="1597738927006" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10066" width="200" height="200"><path d="M704.004477 124.640742c-74.442456 0-148.627039 33.120328-196.407252 87.968517-47.745421-54.848189-113.125477-87.968517-187.593516-87.968517-139.306766 0-252.630764 111.132076-252.630764 247.720941 0 222.305085 206.957539 361.722368 343.891258 453.981608 34.504862 23.232121 56.45478 37.229926 78.723969 55.406914l17.609053 17.609053 17.609053-17.609053c22.251793-18.176988 53.032844-32.17377 87.528496-55.42431 136.951115-92.240821 343.891258-231.6755 343.891258-453.963189C956.626032 235.772818 843.293847 124.640742 704.004477 124.640742z" p-id="10067" fill="#8a8a8a"></path></svg>
                            喜欢
                        </li>
                        </ul>
                            <p style="clear: both;"></p>
                    </div>
                    <hr>`
                $('#comment').append(strHTMl)

    }
    window.onscroll=function(){
            var far=document.documentElement.scrollTop
            var returns=document.getElementById('return')
            if(far>=380){
                returns.style.display='block'
            }
            else{
                returns.style.display='none'
            }
        }

    function onFocus(that){
        console.log($('#aIds').html())
        console.log(localStorage['name'])
        if($('#follow').css('backgroundColor')=='rgb(240, 248, 255)'){   //关注
            $.ajax({
                url:'http://localhost:3000/mainContent/focusThis',
                type:'get',
                data:{
                    aId:$('#aIds').html(),
                    uId:localStorage['name']
                },
                dataType:'json',
                success:function(res){
                    console.log("关注成功")
                }

            })
        }else{
            $.ajax({
                url:'http://localhost:3000/mainContent/focusDel',
                type:'get',
                data:{
                    aId:$('#aIds').html(),
                    uId:localStorage['name']
                },
                dataType:'json',
                success:function(res){
                    console.log("取消成功")
                }

            })
        }   
    }
    </script>
</head>
<body>
    
    <!-- 通栏 -->
    <!-- <div id="total" style="background-color: #fff;">
        <div class="title">
            <ul>
                <li class="first"><img style="width: 100px; height: 50px;margin-left: -40px;margin-top: -14px;" src="images/知遇.png" alt=""></li>
                <li class="first">首页</li>
                <li class="first">发现</li>
                <li class="first">等你来答</li>
            <form action="">
                <li class="first" style="width: 200px; padding-left: 40px; position: relative; top: -8px;">
                    <input type="text" style="width: 200px;height: 30px;" maxlength="11" placeholder="多地高校明确秋季开学时间"></li>
                    <svg class="inputbg" t="1597731143968" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8353" width="200" height="200"><path d="M798.386532 434.840666c0 90.322122-32.875059 173.048241-87.325366 236.740866 0 0 195.358181 195.621353 232.072842 231.577263 30.171373 29.522384-4.434167 75.370595-43.419638 33.901111-23.467419-24.980951-228.233239-225.844701-228.233239-225.844701-63.803709 54.933123-146.802359 88.132246-237.587665 88.132246-201.30588 0-364.492043-163.235758-364.492043-364.506784 0-201.271026 163.186162-364.477109 364.492043-364.477109C635.200369 70.363558 798.386532 233.56964 798.386532 434.840666zM433.893466 128.136356c-169.349788 0-306.69027 137.333832-306.69027 306.676681 0 169.398108 137.340482 306.732963 306.69027 306.732963 169.404026 0 306.744508-137.334855 306.744508-306.732963C740.637974 265.470187 603.297491 128.136356 433.893466 128.136356z" p-id="8354" fill="#707070"></path></svg>
                <li class="first" style="padding-left: 50px; position: relative; top: -8px;">
                    <input style="width: 60px; height: 35px; border-style :none;background-color: rgb(94,113,179); color: white; border-radius: 5px;" type="button" value="提问"></li>
            </form>
                <li class="second" ><img src="images/logo.jpg" alt=""></li>
                <li class="second" style="position: relative; top: -8px;">
                    <svg t="1597728984114" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6206" width="200" height="200"><path d="M512 0C229.180952 0 0 229.180952 0 512c0 141.409524 58.514286 270.628571 151.161905 363.27619C197.485714 921.6 0 1024 0 1024h512c282.819048 0 512-229.180952 512-512S794.819048 0 512 0z m-195.047619 365.714286h268.190476c19.504762 0 36.571429 17.066667 36.571429 36.571428S604.647619 438.857143 585.142857 438.857143H316.952381c-19.504762 0-36.571429-17.066667-36.571429-36.571429S297.447619 365.714286 316.952381 365.714286z m414.47619 292.571428H316.952381c-19.504762 0-36.571429-17.066667-36.571429-36.571428S297.447619 585.142857 316.952381 585.142857h414.47619c19.504762 0 36.571429 17.066667 36.571429 36.571429S750.933333 658.285714 731.428571 658.285714z" fill="#8a8a8a" p-id="6207"></path></svg>
                </li>
                <li class="second" style="position: relative; top: -8px;">
                    <svg t="1597729015370" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7331" width="200" height="200"><path d="M876.266158 704.70146H882.692115a70.614907 70.614907 0 0 1 70.614906 70.614906v2.895212a70.614907 70.614907 0 0 1-70.614906 70.614906H141.235596a70.614907 70.614907 0 0 1-70.614906-70.614906v-2.895212a70.614907 70.614907 0 0 1 70.614906-70.614906h6.425957L153.24013 353.074533C156.36484 158.071468 316.960791 0 511.963856 0s355.599016 158.071468 358.706071 353.074533l5.596231 351.626927zM370.981195 865.032605h299.619048a150.056676 150.056676 0 1 1-299.601395 0z" p-id="7332" fill="#8a8a8a"></path></svg>
                </li>
                
            </ul>
            <div id='ownNotice'>
                <div class="ownNoticeIcon"></div>
                <div class="ownNoticeMain"  style="background-color: white;"> 
                    <ul class="ownNoticeUl" >
                        <li><svg t="1598012557872" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2244" width="32" height="32"><path d="M313.26 811.73h646.72v-99.49H313.26v99.49z m0-298.48h646.72v-99.49H313.26v99.49z m0-397.98v99.49h646.72v-99.49H313.26zM64.53 811.73h149.24v-99.49H64.53v99.49z m0-298.48h149.24v-99.49H64.53v99.49z m0-298.49h149.24v-99.49H64.53v99.49z" p-id="2245" fill="#8a8a8a"></path></svg></li>
                        <li><svg t="1598014008151" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3556" width="200" height="200"><path d="M164.445091 330.984727c0-95.604364 79.080727-173.102545 176.64-173.102545 97.605818 0 176.686545 77.498182 176.686545 173.102545s-79.127273 173.102545-176.686545 173.102546-176.64-77.498182-176.64-173.102546zM407.272727 808.354909v-11.962182c0-88.250182 45.986909-165.794909 115.339637-211.502545a230.958545 230.958545 0 0 0-100.491637-23.086546H274.850909c-126.045091 0-228.212364 100.072727-228.212364 223.557819v14.42909c0 50.501818 102.167273 50.501818 228.212364 50.501819H415.650909a101.841455 101.841455 0 0 1-8.378182-41.937455z m313.623273-532.852364c-80.942545 0-146.618182 64.325818-146.618182 143.685819s65.675636 143.685818 146.618182 143.685818c80.989091 0 146.618182-64.325818 146.618182-143.685818s-65.582545-143.685818-146.618182-143.685819z m0 0c-80.942545 0-146.618182 64.325818-146.618182 143.685819s65.675636 143.685818 146.618182 143.685818c80.989091 0 146.618182-64.325818 146.618182-143.685818s-65.582545-143.685818-146.618182-143.685819z m-54.923636 335.313455c-104.634182 0-189.44 83.083636-189.44 185.576727v11.962182c0 41.890909 84.805818 41.890909 189.44 41.890909h122.228363c104.587636 0 189.346909-1.536 189.346909-41.890909v-11.962182c0-102.493091-84.759273-185.576727-189.346909-185.576727h-122.228363z m0 0" p-id="3557" fill="#8a8a8a"></path></svg></li>
                        <li><svg t="1598014038999" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4461" width="200" height="200"><path d="M890.2 208.2c-91.8-91.9-242.1-91.9-334 0L544.4 220c-18.2 18.2-47.6 18.2-65.8 0l-11.8-11.8c-91.9-91.9-242.1-91.9-334 0C41 300 24.7 533.9 203.6 722.1 304 827.8 412.4 882.3 470 905.9c26.6 10.9 56.5 10.9 83 0 57.6-23.6 166-78.1 266.4-183.8 178.9-188.2 162.6-422 70.8-513.9z" p-id="4462" fill="#8a8a8a"></path></svg></li>
                    </ul>
                    <p style="clear: both;"></p>
                    <hr style="color: rgb(235,235,235);">
                    <div class='ownNoticeTXT'>
                        <div class="ownNoticetext" ><p><span>菜菜呐</span>&nbsp;的提问等你来答&nbsp;<span>你是怎么放弃你曾经很喜欢的人？</span></p></div>
                        <div class="ownNoticetext" ><p><span>菜菜呐</span>&nbsp;的提问等你来答&nbsp;<span>你是怎么放弃你曾经很喜欢的人？</span></p></div>
                        <div class="ownNoticetext" ><p><span>菜菜呐</span>&nbsp;的提问等你来答&nbsp;<span>你是怎么放弃你曾经很喜欢的人？</span></p></div>
                        <div class="ownNoticetext" ><p><span>菜菜呐</span>&nbsp;的提问等你来答&nbsp;<span>你是怎么放弃你曾经很喜欢的人？</span></p></div>
                    </div>
                    <hr  style="margin-top:10px; color: rgb(235,235,235);">
                    <div style="height: 30px;">
                        <span style="margin: 5px;color:rgb(133,144,166);">
                            <svg  t="1598018064372" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5496" width="12" height="12"><path d="M962.42128 386.732858h-123.858266a350.940182 350.940182 0 0 0-54.989515-92.949693l62.590221-108.411204a43.364482 43.364482 0 0 0-15.866112-59.216144L689.193255 44.693883a43.350032 43.350032 0 0 0-59.216144 15.866111l-63.449996 109.906781a352.031158 352.031158 0 0 0-105.607902 0L397.469216 60.559994a43.350032 43.350032 0 0 0-59.216143-15.866111L197.148719 126.148592a43.364482 43.364482 0 0 0-15.866111 59.216144l62.590221 108.403979a351.019657 351.019657 0 0 0-54.989516 92.956918H65.025048a43.350032 43.350032 0 0 0-43.350032 43.350032v162.931094a43.350032 43.350032 0 0 0 43.350032 43.350032h120.267438a350.456107 350.456107 0 0 0 55.50249 98.281747l-59.505143 103.079151a43.350032 43.350032 0 0 0 15.866111 59.216143l141.097129 81.46916a43.364482 43.364482 0 0 0 59.216143-15.873337l58.594793-101.489649c38.090228 6.358005 77.220857 6.358005 115.311084 0l58.594793 101.489649a43.364482 43.364482 0 0 0 59.216144 15.873337l141.104353-81.46916a43.328357 43.328357 0 0 0 15.866112-59.216143l-59.512369-103.079151a350.282707 350.282707 0 0 0 55.502491-98.281747h120.267438a43.350032 43.350032 0 0 0 43.350032-43.350032v-162.923869a43.342807 43.342807 0 0 0-43.342807-43.350032zM708.216694 516.147153c0 107.247979-87.249164 194.497142-194.497143 194.497142-107.255204 0-194.504367-87.249164-194.504367-194.497142s87.249164-194.497142 194.504367-194.497142c107.247979 0 194.497142 87.249164 194.497143 194.497142z" fill="#8a8a8a" p-id="5497"></path></svg>
                             设置
                        </span>
                        <p style="float: right; color:rgb(133,144,166);margin:5px;"> 查看全部通知</p> 
                    </div>
                </div>
            </div>
            
        </div>
    </div> -->
    <div id="Navigation"></div>    
    <!-- 话题 -->
    <div style="width:100%; box-shadow:0px 1px 2px #ddd;background-color: #fff;">
        <div id="heard" style="background-color: #fff;">
            <p style="display: none;" id="aIds">0</p>
            <h1>如何看待台军禁止飞行员对解放军战机开第一枪,否则法办</h1>
            <ul id="heardUl">
                <li id="authorImg"><img src="images/logo.jpg" alt=""></li>
                <li><p>环球时报</p></li>
            </ul>
            <div id="heardP"><span>据台媒报道，解放军战机近期更加频繁进入台湾所谓“防空识别区”甚至越过“海峡中线”。台军方官员表示，为防止“擦枪走火”，引发战端，如果未接到台空军作战指挥部下达的命令，飞行员擅自开“第一枪”，降落后即刻移送法办。</span>
                <button class='alltext'><span>查看全文</span> 
                    <span style="display: inline-flex; align-items: center;">​<svg class="Zi Zi--ArrowDown" fill="currentColor" viewBox="0 0 24 24" width="24" height="24"><path d="M12 13L8.285 9.218a.758.758 0 0 0-1.064 0 .738.738 0 0 0 0 1.052l4.249 4.512a.758.758 0 0 0 1.064 0l4.246-4.512a.738.738 0 0 0 0-1.052.757.757 0 0 0-1.063 0L12.002 13z" fill-rule="evenodd"></path></svg></span>
                </button>
            </div>
            <ul id="heardUl2">
                <li id='follow' onclick="onFocus(this)">关注文章</li>
                <li onclick='writes(this)'><svg t="1597726650851" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2695" width="200" height="200"><path d="M896 864a32 32 0 0 1 0 64H128a32 32 0 0 1 0-64z m-60.16-733.621333l15.093333 15.093333c45.866667 45.834667 45.866667 120.16 0 166.005333L418.794667 743.338667a160.192 160.192 0 0 1-78.122667 42.986666l-152.245333 34.197334c-23.84 5.365333-44.661333-16.853333-37.749334-40.288l43.338667-146.88a160.042667 160.042667 0 0 1 40.373333-67.925334l435.328-435.050666c45.866667-45.834667 120.245333-45.834667 166.112 0zM636.32 254.304L279.68 610.709333a96.021333 96.021333 0 0 0-24.213333 40.746667l-27.946667 94.656 99.093333-22.261333a96.117333 96.117333 0 0 0 46.869334-25.781334L726.933333 344.842667l-90.602666-90.538667z m78.698667-78.656l-33.397334 33.386667 90.602667 90.538666 33.386667-33.376a53.333333 53.333333 0 0 0 0-75.456l-15.093334-15.093333a53.408 53.408 0 0 0-75.498666 0z" p-id="2696" fill="#1296db"></path></svg>
                    写回答
                </li>
                <li><svg t="1597726942194" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2859" width="200" height="200"><path d="M518.965333 847.498667c-21.290667 3.84-43.232 5.834667-65.632 5.834666a366.4 366.4 0 0 1-189.002666-52.181333 2118.4 2118.4 0 0 0-15.306667-8.981333l-86.944 23.712c-23.893333 6.506667-45.813333-15.402667-39.296-39.296l23.68-86.848c-8.821333-15.008-14.656-25.152-17.632-30.709334A366.485333 366.485333 0 0 1 85.333333 485.333333C85.333333 282.090667 250.090667 117.333333 453.333333 117.333333c185.514667 0 338.965333 137.269333 364.32 315.776A255.850667 255.850667 0 0 1 938.666667 650.666667c0 42.709333-10.496 83.978667-30.261334 120.842666-1.792 3.338667-4.992 8.928-9.696 16.96l14.613334 53.557334c6.506667 23.893333-15.402667 45.813333-39.296 39.296l-53.642667-14.634667-6.229333 3.669333A254.933333 254.933333 0 0 1 682.666667 906.666667a255.061333 255.061333 0 0 1-163.701334-59.168z m79.861334-24.042667A191.36 191.36 0 0 0 682.666667 842.666667a190.933333 190.933333 0 0 0 98.570666-27.2c2.208-1.322667 8.288-4.874667 18.517334-10.837334a32 32 0 0 1 24.522666-3.210666l12.565334 3.424-3.424-12.565334a32 32 0 0 1 3.338666-24.725333 996.672 996.672 0 0 0 15.242667-26.293333A190.997333 190.997333 0 0 0 874.666667 650.666667a191.68 191.68 0 0 0-54.634667-134.186667C808.458667 654.570667 720.650667 770.965333 598.826667 823.466667z m-387.050667-129.92l-12.512 45.866667 45.866667-12.512a32 32 0 0 1 24.522666 3.221333c15.253333 8.885333 24.373333 14.218667 27.594667 16.149333A302.4 302.4 0 0 0 453.333333 789.333333C621.226667 789.333333 757.333333 653.226667 757.333333 485.333333S621.226667 181.333333 453.333333 181.333333 149.333333 317.44 149.333333 485.333333c0 50.794667 12.448 99.712 35.904 143.456 3.104 5.792 10.933333 19.306667 23.2 40.021334a32 32 0 0 1 3.338667 24.725333zM586.666667 373.333333a32 32 0 0 1 0 64H320a32 32 0 0 1 0-64h266.666667zM458.666667 533.333333a32 32 0 0 1 0 64H320a32 32 0 0 1 0-64h138.666667z" p-id="2860" fill="#8a8a8a"></path></svg>
                    <span id="commentNum">38</span>条评论
                </li>
                <li id='shares'><svg t="1597727048665" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4554" width="200" height="200"><path d="M711.9 959.9c-10.8 0-21.5-3.3-30.7-9.7L495.3 820.9c-1.5-1-3.5-0.9-4.8 0.4l-72 68.4c-16.2 15.4-39.7 19.2-59.8 9.7-20.2-9.4-32.3-29.9-30.9-52.2l9-141.8c0.8-12.1 5.7-23.8 13.9-32.8l216-237.8c9.3-10.2 25.1-11 35.3-1.7 10.2 9.3 11 25.1 1.7 35.3l-216 237.8c-0.6 0.6-0.9 1.5-1 2.3l-9 141.8c0 0.8-0.2 2.6 2.2 3.7 2.4 1.1 3.7-0.2 4.2-0.7l72-68.4c18.4-17.5 46.9-19.7 67.8-5.2l185.9 129.4c1.1 0.8 2.4 0.9 3.6 0.4 1.3-0.5 2.1-1.5 2.3-2.8L858.2 140c0.1-0.6 0.4-2.3-1.5-3.7-1.9-1.4-3.4-0.7-4-0.4l-745.9 372c-0.5 0.2-2 1-2.1 3.2-0.1 2.2 1.3 3.1 1.8 3.4l198 123.2c11.7 7.3 15.3 22.7 8 34.4s-22.7 15.3-34.4 8L80 557c-16.5-10.3-26.2-28.8-25.3-48.2 0.9-19.5 12.3-36.9 29.7-45.6l745.9-372c18.4-9.2 40-7.2 56.4 5.2s24.3 32.6 20.5 52.8L764.9 915.9c-3.4 18-15.5 33-32.5 40-6.6 2.7-13.6 4-20.5 4z" p-id="4555" fill="#8a8a8a"></path></svg>
                    分享
                </li>
            </ul>
            <div id="share">
                <div class='shareicon'></div>
                <div class="sharemain">
                    <div style=" line-height: 27px;">
                        <svg t="1598079283079" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2394" width="20" height="20"><path d="M607.934444 417.856853c-6.179746-6.1777-12.766768-11.746532-19.554358-16.910135l-0.01228 0.011256c-6.986111-6.719028-16.47216-10.857279-26.930349-10.857279-21.464871 0-38.864146 17.400299-38.864146 38.864146 0 9.497305 3.411703 18.196431 9.071609 24.947182l-0.001023 0c0.001023 0.001023 0.00307 0.00307 0.005117 0.004093 2.718925 3.242857 5.953595 6.03853 9.585309 8.251941 3.664459 3.021823 7.261381 5.997598 10.624988 9.361205l3.203972 3.204995c40.279379 40.229237 28.254507 109.539812-12.024871 149.820214L371.157763 796.383956c-40.278355 40.229237-105.761766 40.229237-146.042167 0l-3.229554-3.231601c-40.281425-40.278355-40.281425-105.809861 0-145.991002l75.93546-75.909877c9.742898-7.733125 15.997346-19.668968 15.997346-33.072233 0-23.312962-18.898419-42.211381-42.211381-42.211381-8.797363 0-16.963347 2.693342-23.725354 7.297197-0.021489-0.045025-0.044002-0.088004-0.066515-0.134053l-0.809435 0.757247c-2.989077 2.148943-5.691629 4.669346-8.025791 7.510044l-78.913281 73.841775c-74.178443 74.229608-74.178443 195.632609 0 269.758863l3.203972 3.202948c74.178443 74.127278 195.529255 74.127278 269.707698 0l171.829484-171.880649c74.076112-74.17435 80.357166-191.184297 6.282077-265.311575L607.934444 417.856853z" p-id="2395" fill="#8a8a8a"></path><path d="M855.61957 165.804257l-3.203972-3.203972c-74.17742-74.178443-195.528232-74.178443-269.706675 0L410.87944 334.479911c-74.178443 74.178443-78.263481 181.296089-4.085038 255.522628l3.152806 3.104711c3.368724 3.367701 6.865361 6.54302 10.434653 9.588379 2.583848 2.885723 5.618974 5.355985 8.992815 7.309476 0.025583 0.020466 0.052189 0.041956 0.077771 0.062422l0.011256-0.010233c5.377474 3.092431 11.608386 4.870938 18.257829 4.870938 20.263509 0 36.68962-16.428158 36.68962-36.68962 0-5.719258-1.309832-11.132548-3.645017-15.95846l0 0c-4.850471-10.891048-13.930267-17.521049-20.210297-23.802102l-3.15383-3.102664c-40.278355-40.278355-24.982998-98.79612 15.295358-139.074476l171.930791-171.830507c40.179095-40.280402 105.685018-40.280402 145.965419 0l3.206018 3.152806c40.279379 40.281425 40.279379 105.838513 0 146.06775l-75.686796 75.737962c-10.296507 7.628748-16.97358 19.865443-16.97358 33.662681 0 23.12365 18.745946 41.87062 41.87062 41.87062 8.048303 0 15.563464-2.275833 21.944801-6.211469 0.048095 0.081864 0.093121 0.157589 0.141216 0.240477l1.173732-1.083681c3.616364-2.421142 6.828522-5.393847 9.529027-8.792247l79.766718-73.603345C929.798013 361.334535 929.798013 239.981676 855.61957 165.804257z" p-id="2396" fill="#8a8a8a"></path></svg>
                        <span><a href="">复制链接</a></span>
                    </div>
                    <div style=" line-height: 27px;">
                        <svg t="1598080492270" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4249" width="20" height="20"><path d="M851.4 590.193c-22.196-66.233-90.385-90.422-105.912-91.863-15.523-1.442-29.593-9.94-19.295-27.505 10.302-17.566 29.304-68.684-7.248-104.681-36.564-36.14-116.512-22.462-173.094 0.866-56.434 23.327-53.39 7.055-51.65-8.925 1.89-16.848 32.355-111.02-60.791-122.395C311.395 220.86 154.85 370.754 99.572 457.15 16 587.607 29.208 675.873 29.208 675.873h0.58c10.009 121.819 190.787 218.869 412.328 218.869 190.5 0 350.961-71.853 398.402-169.478 0 0 0.143-0.433 0.575-1.156 4.938-10.506 8.71-21.168 11.035-32.254 6.668-26.205 11.755-64.215-0.728-101.66z m-436.7 251.27c-157.71 0-285.674-84.095-285.674-187.768 0-103.671 127.82-187.76 285.674-187.76 157.705 0 285.673 84.089 285.673 187.76 0 103.815-127.968 187.768-285.673 187.768z" fill="#E71F19" p-id="4250"></path><path d="M803.096 425.327c2.896 1.298 5.945 1.869 8.994 1.869 8.993 0 17.7-5.328 21.323-14.112 5.95-13.964 8.993-28.793 8.993-44.205 0-62.488-51.208-113.321-114.181-113.321-15.379 0-30.32 3.022-44.396 8.926-11.755 4.896-17.263 18.432-12.335 30.24 4.933 11.662 18.572 17.134 30.465 12.238 8.419-3.46 17.268-5.33 26.41-5.33 37.431 0 67.752 30.241 67.752 67.247 0 9.068-1.735 17.857-5.369 26.202a22.832 22.832 0 0 0 12.335 30.236l0.01 0.01z" fill="#F5AA15" p-id="4251"></path><path d="M726.922 114.157c-25.969 0-51.65 3.744-76.315 10.942-18.423 5.472-28.868 24.622-23.5 42.91 5.509 18.29 24.804 28.657 43.237 23.329a201.888 201.888 0 0 1 56.578-8.064c109.253 0 198.189 88.271 198.189 196.696 0 19.436-2.905 38.729-8.419 57.16-5.508 18.289 4.79 37.588 23.212 43.053 3.342 1.014 6.817 1.442 10.159 1.442 14.943 0 28.725-9.648 33.37-24.48 7.547-24.906 11.462-50.826 11.462-77.175-0.143-146.588-120.278-265.813-267.973-265.813z" fill="#F5AA15" p-id="4252"></path><path d="M388.294 534.47c-84.151 0-152.34 59.178-152.34 132.334 0 73.141 68.189 132.328 152.34 132.328 84.148 0 152.337-59.182 152.337-132.328 0-73.15-68.19-132.334-152.337-132.334zM338.53 752.763c-29.454 0-53.39-23.755-53.39-52.987 0-29.228 23.941-52.989 53.39-52.989 29.453 0 53.39 23.76 53.39 52.989 0 29.227-23.937 52.987-53.39 52.987z m99.82-95.465c-6.382 11.086-19.296 15.696-28.726 10.219-9.43-5.323-11.75-18.717-5.37-29.803 6.386-11.09 19.297-15.7 28.725-10.224 9.43 5.472 11.755 18.864 5.37 29.808z" fill="#040000" p-id="4253"></path></svg>
                        <span><a href="">微博新浪</a></span>
                    </div>
                    <div style=" line-height: 27px;">
                        <svg t="1598080767923" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5138" width="20" height="20"><path d="M669.3 369.4c9.8 0 19.6 0 29.4 1.6C671 245.2 536.9 152 383.2 152 211.6 152 71 269.7 71 416.8c0 85 45.8 156.9 124.2 210.9l-31.1 93.2L273.6 667c39.2 8.2 70.3 16.3 109.5 16.3 9.8 0 19.6 0 31.1-1.6-6.5-21.3-9.8-42.5-9.8-65.4 0.1-135.7 116.2-246.9 264.9-246.9z m-168.4-85c24.5 0 39.2 16.3 39.2 39.2 0 22.9-16.3 39.2-39.2 39.2-24.5 0-47.4-16.4-47.4-39.2 0-24.5 24.6-39.2 47.4-39.2z m-216.3 73.1c-24.7 0-47.8-16.2-47.8-38.8 0-24.3 24.7-38.8 47.8-38.8s39.5 16.2 39.5 38.8c0.1 22.7-16.4 38.8-39.5 38.8z" fill="#24DB5A" p-id="5139"></path><path d="M953.8 613c0-125.9-124.2-227.2-264.8-227.2-148.8 0-266.5 103-266.5 227.2 0 125.9 117.7 227.2 266.5 227.2 31.1 0 62.1-8.2 93.2-16.3l85 47.4-22.9-78.5c62.1-47.4 109.5-109.5 109.5-179.8z m-351.5-39.2c-14.7 0-31.1-14.7-31.1-31.1 0-14.7 16.3-31.1 31.1-31.1 22.9 0 39.2 16.3 39.2 31.1 0 16.4-14.7 31.1-39.2 31.1z m178-7.6c-14.8 0-31.3-14.6-31.3-30.7 0-14.6 16.5-30.7 31.3-30.7 23.1 0 39.5 16.2 39.5 30.7 0 16.2-16.4 30.7-39.5 30.7z" fill="#24DB5A" p-id="5140"></path></svg>
                        <span>微信扫一扫</span>
                    </div>
                    <div>
                        <img src="images/saoyisao.png" alt="" >
                    </div>
                </div>
                
            </div>
            <p id="clear"></p>

        </div>
    </div>
    
    <!-- 回答 -->
    <div id="nav" >
        
        <div id="left"  >
            <div class='write'>
                <div style="padding-bottom:10px">
                    <ul class='writename'>
                        <li><img src='images/logo.jpg' style="width: 38px;height: 38px;"></li>
                        <li>知遇001</li><br>
                        <li style="font-size: 14px;"><svg t="1597886199008" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5713" width="200" height="200"><path d="M965.818182 897.954909a34.909091 34.909091 0 1 1 0 69.818182h-884.363637a34.909091 34.909091 0 1 1 0-69.818182h884.363637z m-0.395637-633.134545L411.415273 818.850909l-215.970909 22.062546 22.085818-215.97091 481.722182-481.745454v-0.023273l72.285091-72.261818c32.488727-32.488727 89.134545-32.488727 121.623272 0l72.261818 72.285091a85.457455 85.457455 0 0 1 25.204364 60.811636c0 22.970182-8.96 44.567273-25.204364 60.811637zM273.617455 762.740364l105.984-10.821819 439.482181-439.505454-95.138909-95.162182-439.505454 439.482182-10.821818 106.007273zM832.349091 115.549091a16.058182 16.058182 0 0 0-11.450182 4.747636l-47.592727 47.569455 95.162182 95.185454 47.569454-47.592727a16.197818 16.197818 0 0 0 0-22.900364l-72.238545-72.261818a16.104727 16.104727 0 0 0-11.450182-4.747636z" fill="#8a8a8a" p-id="5714"></path></svg>
                            编辑话题
                        </li>
                    </ul>
                </div>
                <hr>
                <div class="buttons">
                    <ul style="margin:10; padding: 0;">
                        <li class="contexLi" onclick="changeBlod()"><svg t="1597744234821" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="717" width="30" height="30"><path d="M694.021847 492.679245a208.460775 208.460775 0 0 1 112.873883 74.740815 197.275074 197.275074 0 0 1 37.624627 118.975173 234.899702 234.899702 0 0 1-34.065541 123.551142A203.376365 203.376365 0 0 1 711.817279 892.313803a440.309831 440.309831 0 0 1-168.802383 26.438928h-254.220457a50.844091 50.844091 0 0 1-50.844091-50.844091V168.802383a50.844091 50.844091 0 0 1 50.844091-50.844091h249.644489q145.922542 0 203.376365 63.555114a203.376365 203.376365 0 0 1 59.996028 140.838133 180.496524 180.496524 0 0 1-27.45581 97.112215 206.935452 206.935452 0 0 1-80.333664 73.215491z m-323.368421-39.14995h147.956306A563.860973 563.860973 0 0 0 610.129096 447.428004a122.53426 122.53426 0 0 0 64.063555-31.523337 101.688183 101.688183 0 0 0 27.964251-79.825223A111.34856 111.34856 0 0 0 672.667329 254.220457a121.008937 121.008937 0 0 0-67.114201-33.04866 681.310824 681.310824 0 0 0-101.688183-6.101291H370.653426a25.422046 25.422046 0 0 0-25.422046 25.422046v187.614697a25.422046 25.422046 0 0 0 25.422046 25.422046z m0 370.144985h173.886792a227.781529 227.781529 0 0 0 148.464747-36.607746 127.618669 127.618669 0 0 0 41.692155-101.688182 124.059583 124.059583 0 0 0-44.234359-101.688183 259.304866 259.304866 0 0 0-159.650447-36.099305H370.653426a25.422046 25.422046 0 0 0-25.422046 25.422046v225.239324a25.422046 25.422046 0 0 0 25.422046 25.422046z" fill="#666666" p-id="718"></path></svg></li>
                        <li class="contexLi" onclick="changeAtx()"><svg t="1597744367077" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1010" width="30" height="30"><path d="M602.530909 162.909091l-87.458909 721.454545H616.727273a34.909091 34.909091 0 0 1 0 69.818182h-279.272728a34.909091 34.909091 0 0 1 0-69.818182h107.287273l87.458909-721.454545H430.545455a34.909091 34.909091 0 0 1 0-69.818182h279.272727a34.909091 34.909091 0 0 1 0 69.818182h-107.287273z" fill="#797979" p-id="1011"></path></svg></li>
                        <li class="contexLi"><svg t="1597744424999" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1997" width="30" height="30"><path d="M804.1984 599.3984a51.2 51.2 0 0 1-72.3968-72.3968l93.696-93.696A56.32 56.32 0 0 1 921.6 473.1904V870.4a51.2 51.2 0 0 1-102.4 0v-286.0032l-15.0016 15.0016zM204.8 460.8h358.4V153.6a51.2 51.2 0 0 1 102.4 0v716.8a51.2 51.2 0 0 1-102.4 0v-307.2H204.8v307.2a51.2 51.2 0 0 1-102.4 0V153.6a51.2 51.2 0 1 1 102.4 0v307.2z" fill="#666666" p-id="1998"></path></svg></li>
                        <li class="contexLi"><svg t="1597744549271" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="676" width="30" height="30"><path d="M477.934459 330.486594A50.844091 50.844091 0 0 1 406.752731 258.796425L512 152.532274a254.220457 254.220457 0 0 1 359.467726 359.467726L762.66137 618.772592a50.844091 50.844091 0 1 1-71.690168-71.690169l106.772591-106.772592a152.532274 152.532274 0 0 0-215.578947-215.578947z m70.164846 361.501489A50.844091 50.844091 0 1 1 619.789474 762.66137l-107.281033 107.281033A254.220457 254.220457 0 0 1 152.532274 512L259.813307 406.752731a50.844091 50.844091 0 1 1 72.19861 69.656405l-107.789474 107.281033a152.532274 152.532274 0 0 0 215.578947 215.578947z m-126.601788-16.77855a50.844091 50.844091 0 1 1-71.690168-71.690169l251.678252-251.678252a50.844091 50.844091 0 0 1 71.690169 71.690169z" fill="#666666" p-id="677"></path></svg></li>
                        <li class="contexLi"><svg t="1597744593615" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="695" width="30" height="30"><path d="M512 928H128a32 32 0 0 1-26.88-49.92L345.6 512 101.12 145.92A32 32 0 0 1 128 96h384a32 32 0 0 1 0 64H187.52l223.36 334.08a33.28 33.28 0 0 1 0 35.84L187.52 864H512a32 32 0 0 1 0 64zM640 928a36.48 36.48 0 0 1-17.92-5.12 32.64 32.64 0 0 1-8.96-44.8l256-384a32 32 0 0 1 53.76 35.84l-256 384a33.28 33.28 0 0 1-26.88 14.08z" fill="#4D4D4D" p-id="696"></path><path d="M896 928a33.28 33.28 0 0 1-26.88-14.08l-256-384a32 32 0 1 1 53.76-35.84l256 384a32.64 32.64 0 0 1-8.96 44.8 36.48 36.48 0 0 1-17.92 5.12z" fill="#4D4D4D" p-id="697"></path></svg></li>
                        <li class="contexLi" onclick="changeFont()">
                            <svg t="1597745842692" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2126" width="30" height="30"><path d="M609.28 232.32H152.96V404.48h100.48V332.8h127.36v417.92H306.56v100.48h249.6v-100.48H481.28V332.8h128v71.68h100.48V232.32H609.28z" fill="#231815" p-id="2127"></path><path d="M812.8 492.16H547.84v99.84h58.24V550.4h74.24v242.56h-42.88v58.24H782.08v-58.24h-43.52V550.4h74.24v41.6h58.24V492.16h-58.24z" fill="#231815" p-id="2128"></path></svg>
                        </li>
                    </ul>
                </div>
                <hr>
                <form action="">
                    <textarea name="" style="width:755px; height: 120px;" id="textareas" cols="30" rows="10" placeholder="请输入正文"></textarea>
                    <input type="button" name="" id="up" value="提交" onclick="add()">
                </form>
                
                <hr>
            </div>
            <div class="hui" style="background-color: #fff;">
                <div class='num' style="height: 60px; font-size: 20px;font-weight: 700;margin-left: 20px;line-height: 60px;"><span id="commentNum1">999</span>个回答</div>
                <hr>
                <div id='comment'>
                </div>
            </div>
            
                
            
            

            
        </div>
        <div id="right" style="background-color: #fff;" >
            <div style="height: 60px; font-size: 18px;font-weight: 700;margin-left: 20px;line-height: 60px;">相关问题</div>
            <hr>
            <ul>
                <li>为什么感觉台军的一些训练根本没必要？</li>
                <li>07空军海军的迷彩给空降兵海军陆战队穿是不是生怕敌军看不见？</li>
                <li>中国潜艇部队海上威慑力足以挑战美军吗？</li>
                <li>为何我国空军的密集编队看起来比美军的更松散？</li>
                <li>台军一直升机在基地内坠落，台媒称机上2人已身亡，你怎么看？</li>
            </ul>
        </div>
    </div>

    
    

    <div id="return">
        <svg t="1597893217020" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6530" width="50" height="50"><path d="M838.116 732.779 877.7 693.195 511.979 327.549 146.3 693.195 185.883 732.779 512.003 406.652Z" p-id="6531" fill="#8a8a8a"></path></svg>
    </div>

    <script>
        $("#Navigation").load("Navigation.html");
    </script>
</body>
</html>